<!DOCTYPE html>
<html>

<head>
    <title>OpenSfM Control Points annotation tool</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <link rel="stylesheet" href="/static/css/mosaic.css">
    <script src="/static/js/mosaic.js"></script>
</head>

<div class='inline-flex-parent'>
    <select class="inline-flex-child" id="nColumnsListBox">
        <option value=1>1 Column</option>
        <option value=2 selected>2 Columns</option>
        <option value=3>3 Columns</option>
        <option value=4>4 Columns</option>
    </select>
    <iframe class="inline-flex-child" id="toolsFrame" src="/tools"></iframe>
</div>

<div id="view-grid" class="grid-container">
    {% for route in subpane_routes %}
    <iframe class="view" src="{{route}}"></iframe>
    {% endfor %}
</div>

</html>